<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>table 组件综合演示 - Layui</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link href="../layui/css/layui.css" rel="stylesheet">
	</head>
	<body>

		<div style="padding: 16px;">
			<table class="layui-hide" id="test" lay-filter="test"></table>
		</div>

		<script type="text/html" id="toolDemo">
			<div class="layui-clear-space">
				<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
				<a class="layui-btn layui-btn-xs" lay-event="delete">删除</a>
				<a class="layui-btn layui-btn-xs" lay-event="give">分配</a>
			</div>
		</script>
		<script src="../layui/layui.js"></script>
		<script>
			layui.use(['table', 'dropdown'], function() {
				var table = layui.table;
				var dropdown = layui.dropdown;

				// 创建渲染实例
				table.render({
					elem: '#test',
					url: './data.json', // 此处为静态模拟数据，实际使用时需换成真实接口
					height: 'full-35', // 最大高度减去其他容器已占有的高度差
					css: [ // 重设当前表格样式
						'.layui-table-tool-temp{padding-right: 145px;}'
					].join(''),
					cellMinWidth: 80,
					page: true,
					cols: [
						[{
								field: 'scId',
								fixed: 'left',
								width: 80,
								title: 'ID'
							},
							{
								field: 'scCusname',
								width: 120,
								title: '客户名字'
							},
							{
								field: 'scComming',
								title: '机会来源',
								width: 120
							},
							{
								field: 'scName',
								width: 80,
								title: '联系人'
							},
							{
								field: 'scPhone',
								title: '联系方式',
								width: 150,
							},
							{
								field: 'scSuccess',
								width: 100,
								title: '成功几率'
							},
							{
								field: 'scDesc',
								title: '详细信息'
							},
							{
								field: 'scUser',
								title: '创建人',
								width: 120
							},
							{
								field: 'scCreatetime',
								title: '创建时间',
								width: 120
							},
							{
								field: 'scGiveuser',
								title: '客户经理',
								width: 120
							},
							{
								field: 'scGivetime',
								title: '分配时间',
								width: 120
							},
							{
								field: 'scStatus',
								title: '状态',
								width: 80
							},
							{
								fixed: 'right',
								title: '操作',
								width: 154,
								minWidth: 125,
								templet: '#toolDemo'
							}
						]
					],
					done: function() {
						var id = this.id;
					},
					error: function(res, msg) {
						console.log(res, msg)
					}
				});


				// 触发单元格工具事件
				table.on('tool(test)', function(obj) { // 双击 toolDouble
					var data = obj.data; // 获得当前行数据
					// console.log(obj)
					if (obj.event === 'edit') {
						if (data.scStatus != 0) {
							layer.msg("该销售机会不能修改！")
						} else {
							//打开修改项目
							layer.open({
								type: 2,
								title: "修改销售机会",
								content: "scUpdata.html",
								area: ["900px", "600px"],
								maxmin: true,
								move: false
							})
						}
					} else if (obj.event === 'delete') {
						if (data.scStatus != 0) {
							layer.msg("该销售机会不能修改！")
						} else {
							layer.confirm("确定删除吗？", function(index) {
								layer.close(index);
							})
						}
					} else if (obj.event === 'give') {
						if (data.scStatus != 0) {
							layer.msg("该销售机会不能分配！")
						} else {
							//打开修改项目
							layer.open({
								type: 2,
								title: "分配销售机会",
								area: ["700px", "300px"],
								content: "scUpdata.html",
								maxmin: true,
								move: false
							})

						}
					}
				});

			});
		</script>
	</body>
</html>